<!DOCTYPE HTML>
<html>
<head>
<title>Gallery</title>
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all">
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Fashion Style Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template, 
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<script src="js/jquery-1.8.3.min.js"></script>
<!---- start-smoth-scrolling---->
<script type="text/javascript" src="js/move-top.js"></script>
<script type="text/javascript" src="js/easing.js"></script>
 <script type="text/javascript">
		jQuery(document).ready(function($) {
			$(".scroll").click(function(event){		
				event.preventDefault();
				$('html,body').animate({scrollTop:$(this.hash).offset().top},1200);
			});
		});
	</script>
<!---End-smoth-scrolling---->
<!---lightbox---->
<link rel="stylesheet" type="text/css" href="css/jquery.lightbox.css">
<script src="js/jquery.lightbox.js"></script>
<script>
  // Initiate Lightbox
  $(function() {
    $('.gallery a').lightbox(); 
  });
</script>
<!---lightbox---->
</head>
<body>
		<!--header-->
			<div class="header">
				<div class="container">
					<div class="header-top">
						<div class="logo">
							<a href="index.html">Fashion <span>Style</span></a>
						</div>
						<div class="top-menu">
						<span class="menu"><img src="images/nav.png" alt=""/> </span>
							<ul>
								<li><a href="index.html">home</a></li>
								<li><a href="about.html">about</a></li>
								<li><a href="designers.html">designers</a></li>
								<li><a href="gallery.html" class="active">gallery</a></li>
								<li><a href="typo.html">typo</a></li>
								<li><a href="contact.html">contact</a></li>
							</ul>
						</div>
						 <!--script-nav-->
						 <script>
						 $("span.menu").click(function(){
						 $(".top-menu ul").slideToggle("slow" , function(){
						 });
						 });
						 </script>
						<div class="clerfix"></div>
					</div>
				</div>
			</div>
		<!--header-->
		<div class="header-banner">
			<div class="container">
				<h3>gallery</h3>
			</div>
			</div>
			<!--fashion-->
				<div class="content">
					<div class="fashion-section">
					<div class="container">
				<div class="fashion-grids">
				<div class="col-md-4 fashion-grid">
					<div class="gallery">
						<a class="mask" href="images/p10.jpg"><img src="images/p10.jpg" class="img-responsive zoom-img" alt="/" title="image-name"></a>
					</div>	
				</div>
				<div class="col-md-4 fashion-grid">
					<div class="gallery">
						<a class="mask" href="images/p11.jpg"><img src="images/p11.jpg" class="img-responsive zoom-img" alt="/" title="image-name"></a>
					</div>	
				</div>
				<div class="col-md-4 fashion-grid">
					<div class="gallery">
						<a class="mask" href="images/p12.jpg"><img src="images/p12.jpg" class="img-responsive zoom-img" alt="/" title="image-name"></a>
					</div>	
				</div>
				<div class="clearfix"> </div>
			</div>
			<div class="fashion-grids">
				<div class="col-md-4 fashion-grid">
					<div class="gallery">
						<a class="mask" href="images/p13.jpg"><img src="images/p13.jpg" class="img-responsive zoom-img" alt="/" title="image-name"></a>
					</div>	
				</div>
				<div class="col-md-4 fashion-grid">
					<div class="gallery">
						<a class="mask" href="images/p14.jpg"><img src="images/p14.jpg" class="img-responsive zoom-img" alt="/" title="image-name"></a>
					</div>	
				</div>
				<div class="col-md-4 fashion-grid">
					<div class="gallery">
						<a class="mask" href="images/p15.jpg"><img src="images/p15.jpg" class="img-responsive zoom-img" alt="/" title="image-name"></a>
					</div>	
				</div>
				<div class="clearfix"> </div>
			</div>
			<div class="fashion-grids">
				<div class="col-md-4 fashion-grid">
					<div class="gallery">
							<a class="mask" href="images/p16.jpg"><img src="images/p16.jpg" class="img-responsive zoom-img" alt="/" title="image-name"></a>
						</div>	
				</div>
				<div class="col-md-4 fashion-grid">
					<div class="gallery">
							<a class="mask" href="images/p17.jpg"><img src="images/p17.jpg" class="img-responsive zoom-img" alt="/" title="image-name"></a>
						</div>	
				</div>
				<div class="col-md-4 fashion-grid">
					<div class="gallery">
							<a class="mask" href="images/p18.jpg"><img src="images/p18.jpg" class="img-responsive zoom-img" alt="/" title="image-name"></a>
						</div>	
				</div>
				<div class="clearfix"> </div>
			</div>
		</div>
	</div>
</div>
<!--fashion-->
				<!--footer-->
			<div class="footer text-center">
				<div class="container">
					<div class="footer-grids">
						<div class="col-md-4 footer-text">  
							<h3>About Us</h3>
							<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.Lorem Ipsum has been the industry's.</p>
							<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.Lorem Ipsum has been the industry's.</p>
						</div>
						<div class="col-md-4 footer-flickr">
							<h3>Flickr Feed</h3>
							<div class="flickr-grids">
							<div class="flickr-grid">
								<a href="#"><img src="images/t1.jpg" alt=""/></a>
							</div>
							<div class="flickr-grid">
								<a href="#"><img src="images/c2.jpg" alt=""/></a>
							</div>
							<div class="flickr-grid">
								<a href="#"><img src="images/c1.jpg" alt=""/></a>
							</div>
								<div class="clearfix"> </div>
										
							<div class="flickr-grid">
								<a href="#"><img src="images/c2.jpg" alt=""/></a>
							</div>
							<div class="flickr-grid">
							   <a href="#"><img src="images/c1.jpg" alt=""/></a>
							</div>
							<div class="flickr-grid">
							   <a href="#"><img src="images/t1.jpg" alt=""/></a>
							</div>
								<div class="clearfix"> </div>
						</div>
					</div>
						<div class="col-md-4 footer-info">
							<h3>Get In Touch</h3>
							<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.Lorem Ipsum has been the industry's standard dummy text ever since, </p>
							<div class="support">
								<form>
									<input type="text" value="Your email..." onfocus="this.value='';" onblur="if (this.value == '') {this.value ='Enter your email';}">
									<input type="submit" value="SUBSCRIBE">
								</form>
							</div>
					</div>
					<div class="clearfix"> </div>
				</div>
					<div class="copy">
						<p>Copyright &copy; 2015.Company name All rights reserved.More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a></p>
					</div>
					<script type="text/javascript">
						$(document).ready(function() {
							/*
							var defaults = {
					  			containerID: 'toTop', // fading element id
								containerHoverID: 'toTopHover', // fading element hover id
								scrollSpeed: 1200,
								easingType: 'linear' 
					 		};
							*/
							
							$().UItoTop({ easingType: 'easeOutQuart' });
							
						});
					</script>
				<a href="#head" id="toTop" style="display: block;"> <span id="toTopHover" style="opacity: 1;"> </span></a>
				</div>
			</div>	
<!--footer-->			
</body>
</html>